<!--
 * @Descripttion: 头部快捷方式
 * @version:
 * @Author: 穆宏宇
 * @Date: 2020-09-08 18:39:06
 * @LastEditors: 穆宏宇
 * @LastEditTime: 2020-11-04 18:37:57
-->
<template>
	<div style="border-bottom: 1px solid #ccc;">
		<!--  头部快捷区域    -->
		<div class="common-shortcut">
			<div class="common-shortcut-left" v-if="isLogin()">
				<span>{{username}}<a @click="logout" style="margin-left: 10px;cursor: pointer;">安全退出</a></span>
			</div>
			<div class="common-shortcut-left" v-else>
				<span>您好,<a @click="login" style="cursor: pointer;">请登录！</a></span>
			</div>
			<div class="common-shortcut-right">
				<div class="common-shortcut-right-logins">
					<div style="margin-left: 20px;cursor: pointer;" v-if="doNum" @click="goNav">待办:{{doNum}}</div>
					<ul class="common-shortcut-right-logins-ul">
						<!-- <li class="jump-block">
                <el-button type="text" @click="purchasePlatform">采购中心</el-button>
              </li>
              <li class="jump-block">
                <el-button type="text" @click="administratorPlatform">工作台</el-button>
              </li> -->
						<!-- <li class="jump-block" v-if="isContain">
                <el-button type="text" @click="goOrder">订单管理(审批)</el-button>
              </li> -->
					</ul>
				</div>
				<div>客服电话：{{infor.tel}}</div>
				<el-button type="text" class="common-shortcut-right-cart" @click="settleup" v-if="isLogin()">我的购物车
				</el-button>
				<el-badge :value="num" class="badge-cart" v-if="isLogin()">
					<el-button type="text" @click="settleup">
						<i class="iconfont icongouwuchekong badge-cart-icon"></i>
					</el-button>
				</el-badge>
			</div>
		</div>
	</div>
</template>

<script>
	import {
		getShoppingcarNum
	} from '@/api/mall.api'
	import {
		getUserById
	} from '@/api/admin.api'
	import {
		listnum
	} from '@/api/activiti/task'
	import {
		logout
	} from '@/api/admin.api'
	import {
		getUserInfoByToken
	} from '@/api/mall.api'
	
	export default {
		name: 'common-shortcut',
		props: {},
		components: {},
		data() {
			return {
				infor: this.$config.baseDate,
				num: '',
				username: '',
				authorities: [], // 登录角色
				isContain: false,
				doNum: 0
			}
		},
		watch: {},
		computed: {
			routeJump() {
				return function(param) {
					// 路径为空
					if (!param.path) return {
						path: ''
					}
					const currRoute = this.$route.path
					// 当前路径!=跳转路径 = 跳转
					if (currRoute !== param.path) {
						return {
							path: param.path
						}
					}
					// 不跳转
					else {
						return {
							path: ''
						}
					}
				}
			}
		},
		created() {},
		mounted() {
			// 获取登录状态信息
			this.getLoginInfo()
			if (this.isLogin()) {
				this.getNum();
				// 获取购物车数量
				this.getShoppingcarNumFn()
				// 采购人/采购人本级/超管
				const strRoles = this.$tools.localRead('authorities')
				this.authorities = strRoles.split(',')
				const roles = ['ROLE_Admin', 'ROLE_Super_Admin', 'ROLE_Center_Admin']
				let isContain = false
				this.isContain = false
				for (let i = 0, max = roles.length; i < max; i++) {
					if (this.authorities.includes(roles[i])) {
						isContain = true
						this.isContain = true
						break
					}
				}

			}
		},
		methods: {
			goNav() {
				this.$router.push({
					path: '/task'
				})
			},
			getNum() {
				listnum().then(res => {
					this.doNum = res;
				})
			},
			goOrder() {
				this.$router.push({
					path: '/purchase-order?type=all'
				})
			},
			/**
			 * @description 采购中心平台
			 * @author 穆宏宇
			 * @date 2020-10-29 11:14:41
			 * @param
			 * @return
			 * */
			purchasePlatform() {
				// 采购人/采购人本级/超管
				const roles = ['ROLE_Purchaser', 'ROLE_Purchaser_Level', 'ROLE_Supper_Admin']
				let isContain = false
				for (let i = 0, max = roles.length; i < max; i++) {
					if (this.authorities.includes(roles[i])) {
						isContain = true
						break
					}
				}
				// 采购人/采购人本级/超管
				if (isContain) {
					this.$router.push({
						path: '/purchase-order'
					})
				} else {
					if (this.authorities.includes("ROLE_Purchaser_Activitis")) {
						this.$router.push({
							path: '/purchase-order?type=all'
						})
					} else {
						this.$router.push({
							path: '/purchase'
						})
					}
				}
			},
			/**
			 * @description 管理系统平台
			 * @author 穆宏宇
			 * @date 2020-10-29 11:15:38
			 * @param
			 * @return
			 * */
			administratorPlatform() {
				let routeUrl = this.$router.resolve({
					path: '/home'
				})
				window.open(routeUrl.href, '_blank')
			},
			// 是否登录
			isLogin() {
				const userId = this.$tools.localRead('userId')
				if (userId) {
					return true
				} else {
					return false
				}
			},
			// 获取购物车数量
			getShoppingcarNumFn() {
				getShoppingcarNum().then(res => {
					const numValue = Number(res)
					if (numValue <= 0) {
						this.num = ''
					} else if (numValue > 99) {
						this.num = '99+'
					} else {
						this.num = res
					}
				})
			},
			/**
			 * @description 获取登录状态信息
			 * @author 穆宏宇
			 * @date 2020-10-10 15:10:59
			 * @param
			 * @return
			 * */
			getLoginInfo() {
				var userId = this.$tools.localRead('userId');
				getUserInfoByToken({
					account:localStorage.getItem("account")
				}).then((res)=>{
					var realName = res.name;
					if(realName){
						this.username = this.$tools.localRead('user_name') + "(" + realName + ")"
					}else{
						this.username = this.$tools.localRead('user_name')
					}
				})
				// 获取角色
				const strRoles = this.$tools.localRead('authorities')
				this.authorities = strRoles.split(',')
			},
			// 用户下拉菜单
			onUserClick(name) {
				if (name === 'logout') {
					this.logout()
				}
			},
			/**
			 * @description 退出登录
			 * @author 穆宏宇
			 * @date 2020-10-10 15:10:42
			 * @param
			 * @return
			 * */
			logout() {
				this.$confirm('是否确认退出?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					const user_token = this.$tools.localRead('user_token')
					// 退出登录
					logout(user_token)
					localStorage.clear()
					const currRoute = this.$route.path
					if (currRoute === '/agshop') {
						this.$router.go(0)
					} else {
						this.$router.replace({
							path: '/agshop'
						})
					}
				})
			},
			/**
			 * @description 登录
			 * @author 穆宏宇
			 * @date 2020-09-03 11:21:25
			 * @param
			 * @return
			 * */
			login() {
				this.$router.push('login')
			},
			/**
			 * @description 跳转我的购物车
			 * @author 穆宏宇
			 * @date 2020-09-03 11:21:45
			 * @param
			 * @return
			 * */
			settleup() {
				if (this.isLogin()) {
					this.$router.push('my-cart')
				} else {
					this.$router.push('login')
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	$contentW: 1200px;
	$colorW: #FFFFFF;

	.common-shortcut {
		width: $contentW;
		height: 40px;
		line-height: 40px;
		margin: 0 auto;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		font-size: 14px !important;
		color: #2f2f2f;

		&-right {
			display: flex;
			flex-direction: row;
			justify-content: space-between;

			// 登录
			&-login {
				margin-right: 10px;
				color: #2f2f2f;
			}

			&-cart {
				color: #2f2f2f;
				margin-left: 20px;
			}

			&-logins {
				margin-right: 10px;
				display: flex;
				flex-direction: row;

				&-ul {
					li {
						display: inline;
						margin: 5px;
					}

					li:not(:last-child) {
						border-right: 1px solid #333333;
						padding-right: 10px;
					}
				}
			}
		}
	}

	.badge-cart {
		.el-button {
			padding: 5px 0 0 0 !important;
		}

		&-icon {
			font-size: 20px !important;
			color: red;
		}

		::v-deep .el-badge__content {
			font-size: 12px;
			// height: 12px;
			line-height: 12px;
			padding: 2px 8px !important;
		}
	}

	.el-dropdown-link {
		cursor: pointer;
	}

	.jump-block {
		::v-deep.el-button {
			color: #2f2f2f;
		}
	}
</style>
